<!DOCTYPE HTML>
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>招商网</title>
<meta name="description" content="招商网"/>
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
<meta content="yes" name="apple-mobile-web-app-capable" />
<meta content="black" name="apple-mobile-web-app-status-bar-style" />
<meta content="telephone=no" name="format-detection" />
<meta content="false" id="twcClient" name="twcClient" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" />
<script type="text/javascript" src="cordova-2.7.0.js"></script>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
<script>

	var pictureSource;		//图片来源
	var destinationType;		//设置返回值的格式

	document.addEventListener('deviceready',onDeviceReady,false);
	
	function onDeviceReady(){
		pictureSource=navigator.camera.PictureSourceType;
		destinationType=navigator.camera.DestinationType;
	}

	// 当成功获得一张照片的Base64编码数据后被调用
	function onPhotoDataSuccess(imageData) {
	
		// 返回的是一个图片在SD卡中的目录
		//(如：imageData = file:///storage/sdcard0/Android/data/com.example.phonegapcamera/cache/1372173027935.jpg)
		//很奇怪的是为什么不是二进制Base64编码
		console.log("imageData = " + imageData);
		// 获取图像句柄
		var smallImage = document.getElementById('img1');
			 
		// 取消隐藏的图像元素
		smallImage.style.display = 'block';
		
		// 显示拍摄的照片
		// 使用内嵌CSS规则来缩放图片
		//smallImage.src = "data:image/jpeg;base64," + imageData;
		smallImage.src = imageData;
	}
	   
   // 当成功得到一张照片的URI后被调用
   function onPhotoURISuccess(imageURI) {
	
		// 取消注释以查看图片文件的URI
		//调用相册路径是以android端content://形式返回的一个文件路径
		//(如：imageURI =content://media/external/images/media/70085)
		 console.log("imageURI =" + imageURI);
		// 获取图片句柄
		var largeImage = document.getElementById('img2');
		 
		// 取消隐藏的图像元素
		largeImage.style.display = 'block';
	
		// 显示拍摄的照片
		// 使用内嵌CSS规则来缩放图片
		largeImage.src = imageURI;
	}
	   
   // “Capture Photo”按钮点击事件触发函数
   function capturePhoto() {
		alert("拍照");
		// 使用设备上的摄像头拍照，并获得Base64编码字符串格式的图像
		navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50});
		
   }
   
   // “Capture Editable Photo”按钮点击事件触发函数
   function capturePhotoEdit() {

		// 使用设备上的摄像头拍照，并获得Base64编码字符串格式的可编辑图像
		navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 20, allowEdit: true });
   }
	   
   //“From Photo Library”/“From Photo Album”按钮点击事件触发函数
   function getPhoto(source) {
  		 alert("相册");
   		// 从设定的来源处获取图像文件URI
		navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50,
		destinationType: destinationType.FILE_URI,sourceType: source });
		
   }

   // 当有错误发生时触发此函数
   function onFail(message) {
		alert('Failed because: ' + message);
   }
   
   $(this).ready(function(e) {
    $('#img1').click(function(e) {
        alert("img1 = " + $('#img1').attr('src'));
    });
	
	$('#img2').click(function(e) {
        alert("img2 = " + $('#img2').attr('src'));
    });
});
   
   
</script>
</head>

<body>
<input name="camera" type="button" value="拍照" onclick="capturePhoto();"/><br>

<img name="img1" id="img1" src="images/img.jpg" width="100" height="100" style="display:none"/><br>

<input name="gallery" type="button" value="相册" onclick="getPhoto(pictureSource.PHOTOLIBRARY);"/><br>

<img name="img2" id="img2" src="images/img.jpg" width="100" height="100" style="display:none"/><br>
</body>
</html>
